/*
 * layui的初始化模块可以理解为，引入这个模块的js文件
 * 值得注意的是：layui的模块之间存在依赖关系，例如引入了table模块，它会layui/lay/moudules/table.js
 * 这个文件引入进来，并且它还会将这个模块所依赖的其他模块自动加入进来，
 * 实际引入的模块有：table、form、jquery、layer、laypage、laytpl、util，7个js文件
 * 所以我仅仅初始化了table模块，却能获得form、jquery、layer的模块对象
 */
//layui初始化表格模组
layui.use(['table','upload'], function(){
  //获得模块对象
  var table = layui.table;
  var form = layui.form;
  var $ = layui.jquery;
  var layer = layui.layer;
  var upload = layui.upload;
  
  //数据表格渲染
  var areaTable = table.render({
    elem: '#areaTable'
    ,url:'base/areas'
    ,method: 'get'
    ,where: {} // 你额外要携带数据，以键值对的方式存入
    ,toolbar: '#areaToolbar' // 开启头部工具栏，并为其绑定左侧模板
    ,cellMinWidth: 80 // 全局定义所有常规单元格的最小宽度（默认：60）
    ,cols: [[
      {type:'numbers'} // 序号
      ,{type: 'checkbox'} // 复选框
      ,{field:'areaId', title:'区域ID'}
      ,{field:'province', title:'省'}
      ,{field:'city', title:'市'}
      ,{field:'district', title:'县(区)'}
      ,{field:'postcode', title: '邮编'}
      ,{field:'shortcode', title:'简码'}
      ,{field:'citycode', title: '城市简码'}
      ,{field:'areaLevel', title:'区域级别'}
      ,{field:'attrArea', title:'所属区域'}
      ,{field:'cityLevel', title:'城市级别'}
     // ,{field:'isOuterNet', title:'是否外网'}
      ,{field:'useable', title:'是否可用',templet:function(d){
    	  if(d.useable == 'Y'){
    		  return "可用";
    	  }else{
    		  return "不可用";
    	  }
      }}
     // ,{field:'description', title:'描述'}
      ,{fixed: 'right', align: 'center', title:'冻结或还原', width:100, templet: '#checkboxTpl', unresize: true}
      //,{fixed: 'right', align: 'center', title:'操作', width:120, toolbar: '#resourceBar', unresize: true}
    ]]
    ,page: true // 开启分页
    ,limit: 10 // 每页显示的条数
    ,limits: [5,10,20,50,100] // 每页条数的选择项
    ,loading: true // 是否显示加载条(切换分页的时候显示）
    ,title: '区域数据表' // 定义 table 的大标题（在文件导出等地方会用到）
    //,id: 'areaTable' // 设定容器唯一 id
    ,even: false // 隔行变色
  });
  
  //头部搜素表单提交
  form.on('submit(resourceSearchBtn)', function(data){
	  console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
	  console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
	  console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
	  //执行后台代码
	  var data = data.field;
	  areaTable.reload({
		  where : {
			  'province':data.province,
			  'city':data.city,
			  'district':data.district,
			  'postcode':data.postcode,
			  'shortcode':data.shortcode,
			  'citycode':data.citycode,
			  'attrArea':data.attrArea,
			  'useable':data.useable,
		  },
		  page : {
			  curr : 1
		  }
	  });
	  return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
  });
  
  //新增表单提交
  form.on('submit(addResourceBtn)', function(data){
	  console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
	  console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
	  console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
	  //执行后台代码
	  //刷新数据表格
	  table.reload('areaTable', {url: 'base/areas'});
	  return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
  });
 
  
  //修改表单提交
  form.on('submit(updateAreaBtn)', function(data){
	  console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
	  console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
	  console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
	  //执行后台代码
	  $.ajax({
		type:"post",
		url:'base/area',
		data:data.field,
		success:function(result) {
			if (result == true) {		
				layer.msg('修改成功!');
			} else {
				layer.msg('修改失败!');
			}
			layer.closeAll();
			//刷新数据表格
			table.reload('areaTable', {url: 'base/areas'});
		}
	  	
	});
	return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
  });
  
  
  //头工具栏事件
  table.on('toolbar(areaTableEvent)', function(obj){
	 //获取当前表格选中状态和选中的数据
	var checkStatus = table.checkStatus(obj.config.id);
	//区分点击的按钮
    switch(obj.event){
      case 'addResource':
    	  //弹出新增模态框
    	  initAddResourceModal();
      break;
      case 'updateArea':
    	  //选择的数据数量
    	  if (checkStatus.data.length > 1) {
    		  layer.alert('最多也只能选择一行');
    	  } else if (checkStatus.data.length < 1) {
    		  layer.alert('最少要选择一行');
    	  }else if (checkStatus.data[0].useable =='N') {
    		  layer.alert('您选择的已被禁用了，请重新选择！');
    	  } else {
    		  //弹出修改模态框，传递当前选中的一行数据过去
    		  initUpdateAreaModal(checkStatus.data[0]);
    	  }
      break;
      case 'removeResource':
    	  //当前选中行的数据
    	  var data = checkStatus.data;
    	  if(checkStatus.data.length < 1) {
    		  layer.alert('请选择一行！');
    	  } else {
    		//调用删除方法，传递要删除的行的数据
        	  removeResource(data);
    	  }
      break;
      case 'restoreArea':
    	  //当前选中行的数据
    	  var data = checkStatus.data;
    	  //调用删除方法，传递要删除的行的数据
    	  if(checkStatus.data.length < 1) {
    		  layer.alert('请选择一行！');
    	  } else {
    		  restoreArea(data);
    	  }
      break;
    };
  });
  
  //监听工具条 
  table.on('tool(areaTableEvent)', function(obj){
    var data = obj.data; //获得当前行数据
    var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
    if(layEvent === 'del'){ //删除
      layer.confirm('确认删除吗？', function(index){
    	//把当前要删除的数据放入数组，因为删除方法要的是一个数组对象
    	var objArray = new Array(data);
        //调用删除方法，传递要删除的行的数据
        removeResource(objArray);
        //关闭当前页面
        layer.close(index);
      });
    } else if(layEvent === 'edit'){ //编辑
      //弹出修改模态框，传递当前选中的一行数据过去
      initUpdateAreaModal(data);
    }
  });
  
  //监听锁定操作
  form.on('switch(areable)', function(obj){
	//资源ID
	var areaId = obj.value;
	//定义提示信息, 状态
	var msg, useable;
	if (this.checked) {
		msg = "还原", useable = 'Y';
	} else {
		msg = "禁用", useable = 'N';
	}
	//发送异步请求冻结或还原资源
    $.ajax({
    	async: false, //默认为true，false表示同步，如果当前请求没有返回则不执行后续代码
		type: "post", 
		url:'base/frozenORrecoverArea',
		data : {
			areaId:areaId,
			useable:useable,
		},
		datatype : 'json',
		success:function(result) {
			if (result == true) {
				layer.msg(msg + "成功！", {
				  icon: 1, //图标，可输入范围0~6
				  time: 2500 //2秒关闭（如果不配置，默认是3秒）
				});   
			} else {
				layer.msg(msg + "失败！", {icon: 2, time: 2500}); 
			}
			//刷新数据表格
			table.reload('areaTable', {url: 'base/areas'});
		}
	});
  });
  
  //关闭模态框 新增和修改模态框共用这个点击事件
  $(".modalClose").click(function(){
	  //关闭页面上所有类型的所有弹框
	  layer.closeAll();
  });
  
  //逻辑删除区域的方法 公用
  var removeResource = function(data){
	  //定义一个要删除的所有区域ID的字符串
	  var areaIdStr = "";
	  //遍历传递过来的要删除的数据
	  for (var i = 0; i < data.length; i++) {
		  if(data[i].useable == "N"){
			  	layer.msg('您选择的已被禁用了');
				return;
			}
		  //拿出区域ID进行拼接
		  areaIdStr += data[i].areaId + ",";
	  }
	  //截取掉因为拼接产生的多余的一个逗号
	  areaIdStr = areaIdStr.substring(0, areaIdStr.length - 1);
	  //向服务端发送删除指令
	  //layer.alert('删除=' + areaIdStr);
	  layer.confirm('确认冻结吗?', {icon: 3, title:'提示'}, function(index){
		  $.ajax({
				type: "post", 
				url:'base/frozenORrecoverArea',
				data : {areaIdStr:areaIdStr},
				success:function(result) {
					if (result == true) {
						layer.msg('冻结成功!');
					} else {
						layer.msg('冻结失败!');
					}
					//刷新数据表格
					table.reload('areaTable', {url: 'base/areas'});
				}
		  	});
		  layer.close(index);
		});
	  
  }
  
  //还原区域的方法 公用
  var restoreArea = function(data){
	  //定义一个要删除的所有区域ID的字符串
	  var areaIdStr = "";
	  //遍历传递过来的要删除的数据
	  for (var i = 0; i < data.length; i++) {
		  if(data[i].useable == "Y"){
			  	layer.msg('您选择的已被还原了');
				return;
			}
		  //拿出区域ID进行拼接
		  areaIdStr += data[i].areaId + ",";
	  }
	  //截取掉因为拼接产生的多余的一个逗号
	  areaIdStr = areaIdStr.substring(0, areaIdStr.length - 1);
	  //向服务端发送删除指令
	  layer.confirm('确认还原吗？', {icon: 3, title:'提示'}, function(index){
		  $.ajax({
				type: "post", 
				url:'base/restoreRrecoverArea',
				data : {areaIdStr:areaIdStr},
				success:function(result) {
					if (result == true) {
						layer.msg('还原成功!');
					} else {
						layer.msg('还原失败!');
					}
					//刷新数据表格
					table.reload('areaTable', {url: 'base/areas'});
				}
		  	});
		  layer.close(index);
		});
	 
  }
  
  //初始化新增模态框
  var initAddResourceModal = function(){
	  //弹出一个页面层
	  layer.open({
		  type: 1 // 基本层类型0~4，1为页面层
		  ,title: '添加资源' // 标题
		  ,area: ['400px', '550px'] // 宽高 只写一个参数就是表示宽度，高度会自适应
		  ,content: $("#addResourceModal") // 文本、html都行
	      ,anim: 0 // 弹出动画
		  ,resize: false // 是否允许拉伸
		  ,end : function(){ // 弹出层销毁时的回调函数（不论何种方式，只要关闭了就执行）
			  //清空表单
    		  $("#addResourceForm")[0].reset();
		  }    
	  });
  }
  
  //初始化修改模态框
  var initUpdateAreaModal = function(data){
	  $("#updateAreaForm #_method").val("put");
	  //弹出一个页面层
	  layer.open({
		  type: 1 // 基本层类型0~4，1为页面层
		  ,title: '修改区域' // 标题
		  ,area: ['400px', '550px'] // 宽高 只写一个参数就是表示宽度，高度会自适应
		  ,content: $("#updateAreaModal") // 文本、html都行
		  ,anim: 0 // 弹出动画
		  ,resize: false // 是否允许拉伸
		  ,end : function(){ // 弹出层销毁时的回调函数（不论何种方式，只要关闭了就执行）
			  //清空表单
    		  $("#updateAreaForm")[0].reset();
		  }    
	  });
	  //表单赋值
	  form.val('updateAreaForm', {
		  "areaId": data.areaId
	      ,"province": data.province
	      ,"city": data.city
	      ,"district": data.district
	      ,"postcode": data.postcode
	      ,"shortcode": data.shortcode
	      ,"citycode": data.citycode
	      ,"areaLevel": data.areaLevel
	      ,"attrArea": data.attrArea
	      ,"cityLevel": data.cityLevel
	      ,"useable": data.useable
          ,"description": data.description
	  });
  }
  //指定允许上传的文件类型
  upload.render({
    elem: '#test3',
    url: 'base/import',
    exts : 'xls|xlsx',
    method:'post',
    accept: 'file', //普通文件
    done: function(res,index,upload){
    	layer.msg("上传成功");
    	//刷新表格
    	table.reload('areaTable',{
    		url:'base/areas'
    	})
	    },
	  error : function(index,upload){
		  
	  }
  })
});
